<template>
    <div class="content-wrap">
        <div class="left" v-if="historyData.error != '0x0'">
            <div class="history-wrap">
                <span
                    ><p class="name">日志生成时间：</p>
                    {{ historyData.updateTime }}</span
                >
                <span
                    ><p class="name">SN：</p>
                    {{ historyData.serialNumber }}</span
                >
                <span
                    ><p class="name">Hash IC：</p>
                    {{ historyData.miningStrategy }}</span
                >
                <span
                    ><p class="name">模式：</p>
                    {{ historyData.serialNumber }}</span
                >
                <span
                    ><p class="name">工作状态：</p>
                    {{ historyData.status }}</span
                >
                <span
                    ><p class="name">时长：</p>
                    {{ historyData.totalRunningTime }}</span
                >
                <span
                    ><p class="name">本地算力(TH)：</p>
                    {{ historyData.averageHashRate }}</span
                >
                <span
                    ><p class="name">软件版本：</p>
                    {{ historyData.swVersion }}</span
                >
                <span>
                    <p class="name">老化结果：</p>
                    <p :class="historyData.runResult === 'pass' ? '':'redColor'">{{ historyData.runResult }}</p>
                </span>
                <span class="redColor"
                    ><p class="name">Error Code：</p>
                    {{ historyData.error }}</span
                >
                <span class="redColor" v-if="historyData.errorNum != '0x0'"
                    ><p class="name">错误描述：</p>
                    {{ historyData.errorDescribe }}
                    <!-- <div v-for="(item, index) in errorDetail" :key="index">
                        <span v-for="(objItem, objIndex) in item" :key="objIndex">{{ objItem }}</span>
                    </div> -->
                </span>
            </div>
        </div>
        <ul class="right">
            <ul class="item-wrap" v-for="(board, boardIndex) in historyData.boardList" :key="boardIndex">
                <li class="form" v-if="board.errorNum != '0' && board.errorNum != '4000'">
                    <span class="spanItem"
                        ><p class="name">{{ board.computeBoardName }}：</p>
                        {{ board.serialNumber }}</span
                    >
                    <span class="spanItem"
                                ><p class="name">算力版状态：</p>
                                {{ board.error === '4000' ? 'pass' : (board.error === '0' ? 'pass' : 'fail') }}</span
                            >
                    <span class="spanItem" v-if="board.error != '4000' || board.error != '0'"
                        ><p class="name">Error Code：</p>
                        {{ board.errorNum }}</span
                    >
                    <span class="spanItem"
                        ><p class="name">本地算力(TH)：</p>
                        {{ board.averageHashRate }}</span
                    >
                    <span class="errorItem" v-if="board.errorNum != '0' && board.errorNum != '4000'"
                        ><p class="name">错误描述：</p>
                        <div>
                            <ul
                                class="redColor"
                                style="display: flex; flex-direction: column; align-items: center"
                                v-for="(error, errorIndex) in JSON.parse(board.errorDetail)"
                                :key="errorIndex"
                            >
                                <li v-for="(item, index) in error" :key="index">
                                    {{ item }}
                                </li>
                            </ul>
                        </div>
                    </span>
                </li>
            </ul>
        </ul>
    </div>
</template>

<script>
export default {
    props: {
        historyData: Object
    }
};
</script>

<style lang="less" scoped>
// 内容区域
.content-wrap {
    display: flex;
    margin-top: 10px;
    .left {
        width: 50%;
        padding: 5px;
        border-radius: 10px;
        background-color: #fff;
        .history-wrap {
            span {
                display: flex;
                align-items: center;
                margin: 5px 0;
                .name {
                    color: black;
                    font-weight: bold;
                }
            }
            .redColor {
                color: #e0001b;
            }
        }
    }
    .right {
        width: 50%;
        border-radius: 10px;
        background-color: #fff;
        .item-wrap {
            .form {
                .spanItem {
                    display: flex;
                    align-items: center;
                    margin: 5px 0;
                    .name {
                        color: black;
                        font-weight: bold;
                    }
                }
                .errorItem {
                    display: flex;
                    flex-flow: wrap;
                    .name {
                        color: black;
                        font-weight: bold;
                    }
                    .redColor {
                        color: #e0001b;
                    }
                }
            }
        }
    }
}
</style>